<template>
  <div>
    <div>
      <el-tabs v-model="activeName" @tab-click="handleClick" disabled="false">
        <el-tab-pane label="合同信息" name="first">
          <div class="app-container">
            <el-form :model="queryParams" ref="form" :inline="true" v-show="showSearch">
              <h1>房产信息
                <el-button  @click="dialogVisible = true">选择合同</el-button>
              </h1>
              <el-dialog
                title="提示"
                :visible.sync="dialogVisible"
                width="70%">
                <el-table v-loading="loading" :data="postList">
                  <el-table-column label="房产信息" align="center" prop="premiseName" />
                  <el-table-column label="居室" align="center" prop="houseName" />
                  <el-table-column label="租房类型" align="center" prop="houseType">
                      <template slot-scope="scope">
                        <span v-if="scope.row.houseType==1">国有房产</span>
                        <span v-if="scope.row.houseType==2">直管房产</span>
                        <span v-if="scope.row.houseType==3">自管房产</span>
                        <span v-if="scope.row.houseType==4">军队房产</span>
                        <span v-if="scope.row.houseType==5">集体所有房产</span>
                        <span v-if="scope.row.houseType==6">私有(自由)房产</span>
                        <span v-if="scope.row.houseType==7">港、澳、台投资房产</span>
                        <span v-if="scope.row.houseType==8">涉外房产</span>
                        <span v-if="scope.row.houseType==9">其他房产</span>
                      </template>
                  </el-table-column>
                  <el-table-column label="签约日期" align="center" prop="conInfoTime"/>
                  <el-table-column label="操作">
                    <template slot-scope="scope">
                      <el-button
                        size="mini"
                        @click="handleEdit(scope.row)">选择</el-button>
                    </template>
                  </el-table-column>
                </el-table>

                <pagination
                  v-show="total>0"
                  :total="total"
                  :page.sync="queryParams.pageNum"
                  :limit.sync="queryParams.pageSize"
                  @pagination="getList"
                />
                <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
  </span>
              </el-dialog>
              <div>
                <el-form-item label="小区名称" prop="premiseName" >
                  <el-input
                    v-model="form.premiseName"
                    placeholder="小区名称"
                    clearable
                    size="small"
                    :disabled="true"
                    @keyup.enter.native="handleQuery"
                  />
                </el-form-item>
                <!--      房产信息(考虑在房产表中增加house_name，然后带出)-->
                <el-form-item label="房产信息" prop="houseName">
                  <el-input
                    v-model="form.houseName"
                    placeholder="请输入房产信息"
                    clearable
                    size="small"
                    :disabled="true"
                    @keyup.enter.native="handleQuery"
                  />
                </el-form-item>
                <br>
                <el-form-item label="所有权类型">
                  <el-select v-model="form.houseType" placeholder="请选择所有权类型" clearable size="small">
                    <el-option value="1" label="国有房产">国有房产</el-option>
                    <el-option value="2" label="直管房产"></el-option>
                    <el-option value="3" label="自管房产"></el-option>
                    <el-option value="4" label="军队房产"></el-option>
                    <el-option value="5" label="集体所有房产"></el-option>
                    <el-option value="6" label="">私有(自由)房产</el-option>
                    <el-option value="7" label="港、澳、台投资房产"></el-option>
                    <el-option value="8" label="涉外房产"></el-option>
                    <el-option value="9" label="其他房产"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="房产证书编号" prop="houseZsNo">
                  <el-input
                    v-model="form.houseZsNo"
                    placeholder="请输入房产证书编号"
                    clearable
                    size="small"
                    @keyup.enter.native="handleQuery"
                  />
                </el-form-item>
                <br>
                <el-form-item label="产权地址" prop="cqAddress">
                  <el-input
                    v-model="form.cqAddress"
                    placeholder="请输入产权地址"
                    clearable
                    size="small"
                    @keyup.enter.native="handleQuery"
                  />
                </el-form-item>
              </div>
              <h1>业主信息</h1>
              <el-form-item label="业主姓名" prop="ownerName">
                <el-input
                  type="redio"
                  v-model="form.ownerName"
                  placeholder="请输入业主姓名"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="" prop="signWithOwner">
                <el-radio v-model="form.signWithOwner" label="1">是否为签约人</el-radio>
              </el-form-item>
              <el-form-item label="" prop="certificateType">
                <el-select v-model="form.certificateType" placeholder="证件类型类型" clearable size="small" style="width: 100px">
                  <el-option value="身份证" label="身份证"></el-option>
                  <el-option value="护照" label="护照"></el-option>
                  <el-option value="台胞证" label="台胞证"></el-option>
                  <el-option value="港澳通行证" label="港澳通行证"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="业主证件号码" prop="ownerIdCard">

                <el-input
                  v-model="form.ownerIdCard"
                  placeholder="请输入业主证件号码"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <br>
              <el-form-item label="业主手机号" prop="ownerMobile">
                <el-input
                  v-model="form.ownerMobile"
                  placeholder="请输入业主手机号"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="业主联系地址" prop="ownerContactAddress">
                <el-input
                  v-model="form.ownerContactAddress"
                  placeholder="请输入业主联系地址"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <br>
              <el-form-item label="签约人" prop="signUserName">
                <el-input
                  v-model="form.signUserName"
                  placeholder="请输入签约人"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="" prop="certificateType">
                    <el-select v-model="form.certificateType" placeholder="证件类型类型" clearable size="small" style="width: 100px">
                      <el-option value="身份证" label="身份证"></el-option>
                      <el-option value="护照" label="护照"></el-option>
                      <el-option value="台胞证" label="台胞证"></el-option>
                      <el-option value="港澳通行证" label="港澳通行证"></el-option>
                    </el-select>
              </el-form-item>
              <el-form-item label="签约人证件号" prop="signUserIdCard">
                <el-input
                  v-model="form.signUserIdCard"
                  placeholder="请输入签约人证件号"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <br>
              <el-form-item label="签约人手机号" prop="signUserMobile">
                <el-input
                  v-model="form.signUserMobile"
                  placeholder="请输入签约人手机号"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="紧急联系电话" prop="urgMobile">
                <el-input
                  v-model="form.urgMobile"
                  placeholder="请输入紧急联系电话"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <br>
              <el-form-item label="账户类型" prop="houseType">
                <el-select v-model="zhtype" placeholder="请选择" clearable size="small"  @change="gai">

                  <el-option label="对公账号" value=1 />
                  <el-option label="对私账号" value=2 />
                </el-select>
              </el-form-item>
              <br>

              <!-- 777777-->
              <el-form-item label="银行名称" prop="bankName"  v-show="gong">
                <el-select v-model="value" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
              <br>
              <el-form-item label="开户行(支行)" prop="bankOpen" v-show="gong">
                <el-input
                  v-model="form.bankOpen"
                  placeholder="请输入开户行(支行)"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="联行行号" prop="bankOpen" v-show="gong">
                <el-input
                  v-model="form.bankBranchCodeLh"
                  placeholder="联行行号"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <br>
              <el-form-item label="账户姓名" prop="bankUserName" v-show="gong">
                <el-input
                  v-model="form.bankUserName"
                  placeholder="账户姓名"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="银行卡号" prop="bankCard" v-show="gong">
                <el-input
                  v-model="form.bankCard"
                  placeholder="请输入银行卡号"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <!--77777777777777-->

              <!-- 888888888-->
              <el-form-item label="银行名称" prop="bankName"  v-show="si">
                <el-select v-model="value" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
              <br>
              <el-form-item label="账户姓名" prop="bankUserName" v-show="si">
                <el-input
                  v-model="form.bankUserName"
                  placeholder="账户姓名"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="银行卡号" prop="bankCard" v-show="si">
                <el-input
                  v-model="form.bankCard"
                  placeholder="请输入银行卡号"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <!--888888888-->
              <span style="width: 900px"></span>
              <h1>租约信息</h1>
              <el-form-item label="租约期限" prop="leaseStartTime">
                <el-date-picker clearable size="small"
                                v-model="form.leaseStartTime"
                                type="date"
                                value-format="yyyy-MM-dd"
                                placeholder="选择租约期限">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="至" prop="leaseEndTime">
                <el-date-picker clearable size="small"
                                v-model="form.leaseEndTime"
                                type="date"
                                value-format="yyyy-MM-dd"
                                placeholder="选择租约期限">
                </el-date-picker>
              </el-form-item>
              <el-button @click="one">一年</el-button>
              <el-button @click="two">二年</el-button>
              <el-button @click="three">三年</el-button>
              <el-button @click="four">四年</el-button>
              <el-button @click="five">五年</el-button>
              <br>
              <el-form-item label="租金" prop="monthRent">
                <el-input
                  v-model="form.monthRent"
                  placeholder="请输入租金"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="房产押金" prop="depositMoney">
                <el-input
                  v-model="form.depositMoney"
                  placeholder="请输入房产押金"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <br>
              <span>支付方式：</span>
              <el-form-item label="押" prop="depositType" >
                <el-select v-model="form.depositType"  clearable size="small">
                  <el-option label="0" value="0" />
                  <el-option label="1" value="1" />
                  <el-option label="2" value="2" />
                  <el-option label="3" value="3" />
                </el-select>
              </el-form-item>
              <el-form-item label="付" prop="paymentType">
                <el-select  v-model="form.paymentType"  clearable size="small">
                  <el-option label="0" value="0" />
                  <el-option label="1" value="1" />
                  <el-option label="2" value="2" />
                  <el-option label="3" value="3" />
                  <el-option label="4" value="4" />
                  <el-option label="5" value="5" />
                  <el-option label="6" value="6" />
                </el-select>
              </el-form-item>
              <br>
              <el-form-item label="备注" prop="remark">
                <el-input
                  type="textarea"
                  v-model="form.remark"
                  placeholder="备注"
                  clearable
                  size="small"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <br>
              <el-form-item style="margin-left: 700px">
                <el-button type="primary" icon="el-icon-scissors" size="mini" @click="handleQuery">取消</el-button>
                <el-button icon="el-icon-right" size="mini" @click="resetQuery">下一步</el-button>
              </el-form-item>
            </el-form>
          </div>
        </el-tab-pane>
        <br>-------------------------------------------------------------------------------------------<br>
        <el-tab-pane label="附件" name="second" disabled>
          <h1>房产证图片</h1>
          <el-upload
            class="avatar-uploader"
            action="http://localhost/dev-api/home/contract/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess">
            <img v-if="imageUrl" :src="imageUrl" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
          <br>-------------------------------------------------------------------------------------------<br>
          <h1>收房合同</h1>
          <el-upload
            class="avatar-uploader"
            action="http://localhost/dev-api/home/contract/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess2">
            <img v-if="imageUrl2" :src="imageUrl2" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
          <br>-------------------------------------------------------------------------------------------<br>
          <h1>业主身份证照片</h1>
          <el-upload
            class="avatar-uploader"
            action="http://localhost/dev-api/home/contract/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess3">
            <img v-if="imageUrl3" :src="imageUrl3" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
          <br>-------------------------------------------------------------------------------------------<br>
          <h1>代理人身份证明</h1>
          <el-upload
            class="avatar-uploader"
            action="http://localhost/dev-api/home/contract/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess4">
            <img v-if="imageUrl4" :src="imageUrl4" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
          <br>-------------------------------------------------------------------------------------------<br>
          <h1>银行卡信息</h1>
          <el-upload
            class="avatar-uploader"
            action="http://localhost/dev-api/home/contract/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess5">
            <img v-if="imageUrl5" :src="imageUrl5" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
          <br>-------------------------------------------------------------------------------------------<br>
          <h1>委托书</h1>
          <el-upload
            class="avatar-uploader"
            action="http://localhost/dev-api/home/contract/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess6">
            <img v-if="imageUrl6" :src="imageUrl6" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
          <br>-------------------------------------------------------------------------------------------<br>
          <h1>物业交割单</h1>
          <el-upload
            class="avatar-uploader"
            action="http://localhost/dev-api/home/contract/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess7">
            <img v-if="imageUrl7" :src="imageUrl7" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
          <br>-------------------------------------------------------------------------------------------<br>
          <h1>其他</h1>
          <el-upload
            class="avatar-uploader"
            action="http://localhost/dev-api/home/contract/upload"
            :show-file-list="false"
            :on-success="handleAvatarSuccess8">
            <img v-if="imageUrl8" :src="imageUrl8" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
          <br>-------------------------------------------------------------------------------------------<br>
          <el-button icon="el-icon-back" size="mini" @click="shang1">上一步</el-button>
          <el-button icon="el-icon-s-promotion" size="mini" @click="resetQuery2">跳过</el-button>
          <el-button icon="el-icon-right" size="mini" @click="resetQuery2">下一步</el-button>
          <br>-------------------------------------------------------------------------------------------<br>
          <br>
        </el-tab-pane>
        <el-tab-pane label="付款单" name="third" disabled>
          付款单
          <el-table
            :data="tableData"
            style="width: 100%">
            <el-table-column
              label="序号"
              width="180">
              <template slot-scope="scope">
                {{scope.$index}}
                <span v-if="scope.$index==0 || scope.$index==1" style="color: red">(第一期)</span>
              </template>
            </el-table-column>
            <el-table-column
              label="应付日期"
              prop="payableDate">
            </el-table-column>
            <el-table-column
              label="金额"
              prop="paymentAmount">
              <template scope="scope">
                <el-input size="small" v-model="scope.row.paymentAmount" placeholder="请输入内容" :disabled="true"></el-input>
              </template>
            </el-table-column>
            <el-table-column
              label="税费"
              prop="tax">
            </el-table-column>
            <el-table-column
              label="付款状态"
              prop="skStatus">
              <template slot-scope="scope">
                <span v-for=" s in paystasus" v-if="scope.row.skStatus==s.id">{{s.name}}</span>
              </template>
            </el-table-column>
            <el-table-column
              label="房产租金周期"
              prop="date">
              <template slot-scope="scope">
                {{scope.row.paymentDaysBegin}}至{{scope.row.paymentDaysEnd}}
              </template>
            </el-table-column>

            <el-table-column label="操作">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  @click="Edit(scope.$index, scope.row)">编辑</el-button>
              </template>
            </el-table-column>
          </el-table>
          <el-button icon="el-icon-back" size="mini" @click="shang2">上一步</el-button>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script>

import { listContract, getContract, delContract, addContract, updateContract,upload,listquery } from "@/api/home/contract";
import { listInfo } from "@/api/housings/xinxi/info";
import { listBank,queryNames, getBank, delBank, addBank, updateBank } from "@/api/home/bank";
import { getDicts} from "@/api/system/dict/type";
import Termination from "@/views/home/termination/index";

const moment = require('moment')
export default {
  name: "Contract",
  components: {
    Termination
  },
  data() {
    return {
      options: [],
      value: '',
      //付款状态 1:未收款 2：已收款 3：已中止
      paystasus:[
        {id:1,name:"未收款"},{id:2,name:"已收款"},{id:3,name:"已中止"},
      ],
      tableData:[],
      updateTime:null,
      //房源数据
      postList:[],
      dialogVisible: false,
      imageUrl: '',
      imageUrl2: '',
      imageUrl3: '',
      imageUrl4: '',
      imageUrl5: '',
      imageUrl6: '',
      imageUrl7: '',
      imageUrl8: '',
      //对公
      gong:false,
      //对私
      si:false,
      activeName: 'first',
      zhtype:null,
      //
      phone:'1',
      // 所有权状态字典
      houserTypeOptions: [],
      // 证件状态字典
      phoneTypeOptions: [],
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,

      // 【请填写功能名称】表格数据
      contractList: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      // 表单参数
      form: {
        premiseName:null,
        houseType:null,
        houseName:null,
        leaseStartTime:null,
        leaseEndTime:null,
        certificateType:null,
        urgMobile:null,
        houseZsNo:null,
        cqAddress:null,
        ownerName:null,
        signWithOwner:null,
        ownerIdCard:null,
        ownerMobile:null,
        ownerContactAddress:null,
        signUserName:null,
        signUserIdCard:null,
        signUserMobile:null,
        signUserEmergencyPhone:null,
        bankCard:null,
        bankUserName:null,
        bankUserIdCard:null,
        bankId:null,
        bankName:null,
        bankOpen:null,
        monthRent:null,
        depositMoney:null,
        depositType:null,
        paymentType:null,



      },
      // // 表单校验
      // rules: {
      //   premiseName: [
      //     { required: true, message: "小区名(使用楼盘名称)不能为空", trigger: "blur" }
      //   ],
      //   houseId: [
      //     { required: true, message: "房产编号不能为空", trigger: "blur" }
      //   ],
      //   houseName: [
      //     { required: true, message: "房产信息(考虑在房产表中增加house_name，然后带出)不能为空", trigger: "blur" }
      //   ],
      //   houseType: [
      //     { required: true, message: "所有权类型(1：国有房产，2：直管房产，3：自管房产，4：军队房产，5：集体所有房产，6：私有(自由)房产，7：港、澳、台投资房产，8：涉外房产，9：其它房产)不能为空", trigger: "change" }
      //   ],
      //   ownerName: [
      //     { required: true, message: "业主姓名不能为空", trigger: "blur" }
      //   ],
      //   signWithOwner: [
      //     { required: true, message: "是否为签约人不能为空", trigger: "blur" }
      //   ],
      //   signUserName: [
      //     { required: true, message: "签约人(甲方)不能为空", trigger: "blur" }
      //   ],
      //   bankCard: [
      //     { required: true, message: "银行卡号不能为空", trigger: "blur" }
      //   ],
      //   leaseStartTime: [
      //     { required: true, message: "租约期限开始时间不能为空", trigger: "blur" }
      //   ],
      //   leaseEndTime: [
      //     { required: true, message: "租约期限结束时间不能为空", trigger: "blur" }
      //   ],
      //   monthRent: [
      //     { required: true, message: "收房月租金不能为空", trigger: "blur" }
      //   ],
      //   depositType: [
      //     { required: true, message: "支付方式(押X付Y的X)不能为空", trigger: "change" }
      //   ],
      //   paymentType: [
      //     { required: true, message: "支付方式(押X付Y的Y）不能为空", trigger: "change" }
      //   ]
      // }
    };
  },
  created() {
    this.queryNames()
    this.getLists();
  },
  methods: {
    queryNames(){
      queryNames().then(resp=>{
        this.options = resp.rows
        console.log(resp)
      })
    },

    /** 查询【请填写功能名称】列表 */
    getList() {
      this.loading = true;
      listquery(this.queryParams).then(response => {
        this.contractList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    /** 取消按钮操作 */
    handleQuery() {
    },
    /** 下一步按钮操作 */
    resetQuery() {
      this.activeName='second';

      console.log(this.form);

    },
    resetQuery2() {
      this.activeName='third';
      this.$refs["form"].validate(valid => {

        addContract(this.form).then(response => {
          console.log(response.data);
          // console.log(response.CwList);
          this.tableData=response.data;
          console.log(this.tableData);
          // this.open = false;
          // this.getList();
          // data
        });


      })
      console.log(this.queryParams);
    },
    shang1(){
      this.activeName='first';
    },
    shang2(){
      this.activeName='second';
    },
    /** 提交保存按钮 */
    submitForm() {

      // this.$refs["form"].validate(valid => {
      //
      //       addContract(this.form).then(response => {
      //         console.log(response.data);
      //         console.log(response.rows);
      //         // this.tableData=response.rows;
      //         // this.open = false;
      //         // this.getList();
      //         // console.log(this.tableData);
      //       });
      //
      //
      // })
    },
    handleClick(tab, event) {
      console.log(tab, event);
    },
    /**账户类型改变*/
    gai(){
      if(this.zhtype==1){
        this.gong=true;
        this.si=false;
      }
      if(this.zhtype==2){
        this.si=true;
        this.gong=false;
      }
    },
   //房产证图片上传
    handleAvatarSuccess(res, file) {
      this.imageUrl = URL.createObjectURL(file.raw);
      console.log(file);
      console.log(res);
    },
    //收房合同图片上传
    handleAvatarSuccess2(res, file) {
      this.imageUrl2 = URL.createObjectURL(file.raw);
      console.log(file);
      console.log(res);
    },
    //业主身份证图片上传
    handleAvatarSuccess3(res, file) {
      this.imageUrl3 = URL.createObjectURL(file.raw);
      console.log(file);
      console.log(res);
    },
    //代理人身份证图片上传
    handleAvatarSuccess4(res, file) {
      this.imageUrl4 = URL.createObjectURL(file.raw);
      console.log(file);
      console.log(res);
    },
    //银行卡图片上传
    handleAvatarSuccess5(res, file) {
      this.imageUrl5 = URL.createObjectURL(file.raw);
      console.log(file);
      console.log(res);
    },
    //委托书图片上传
    handleAvatarSuccess6(res, file) {
      this.imageUrl6 = URL.createObjectURL(file.raw);
      console.log(file);
      console.log(res);
    },
    //委物业交割单图片上传
    handleAvatarSuccess7(res, file) {
      this.imageUrl7 = URL.createObjectURL(file.raw);
      console.log(file);
      console.log(res);
    },
    //其他图片上传
    handleAvatarSuccess8(res, file) {
      this.imageUrl8 = URL.createObjectURL(file.raw);
      console.log(file);
      console.log(res);
    },
    getLists() {
      listquery(this.queryParams).then(response => {
        this.postList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    //选择房源
    handleEdit(row) {
      console.log(row);
      this.form.premiseName=row.premiseName;
      this.form.houseName=row.houseName;
      console.log(row.houseType)
      this.form.houseType=row.houseType;

      this.form.leaseStartTime=row.leaseStartTime;
      this.form.certificateType=row.certificateType;
      this.form.urgMobile=row.urgMobile;
      this.form.houseZsNo=row.houseZsNo;
      this.form.cqAddress=row.cqAddress;
      this.form.ownerName=row.ownerName;
      this.form.signUserEmergencyPhone=row.signUserEmergencyPhone;
      this.form.ownerIdCard=row.ownerIdCard;
      this.form.ownerMobile=row.ownerMobile;
      this.form.ownerContactAddress=row.ownerContactAddress;
      this.form.signUserName=row.signUserName;
      this.form.signUserIdCard=row.signUserIdCard;
      this.form.signUserMobile=row.signUserMobile;
      this.form.signUserEmergencyPhone=row.signUserEmergencyPhone;
      this.form.bankCard=row.bankCard;
      this.form.bankUserName=row.bankUserName;
      this.form.bankUserIdCard=row.bankUserIdCard;
      this.form.bankId=row.bankId;
      this.form.bankName=row.bankName;
      this.form.bankOpen=row.bankOpen;
      this.form.monthRent=row.monthRent;
      this.form.depositMoney=row.depositMoney;
      this.form.depositType=row.depositType;
      this.form.paymentType=row.paymentType;




      this.dialogVisible=false;
    },
    addDate(){
      const nowDate = new Date();
      const date = {
        year: nowDate.getFullYear(),
        month: nowDate.getMonth() + 1,
        date: nowDate.getDate(),
      }
      const newmonth = date.month>10?date.month:'0'+date.month
      const day = date.date>10?date.date:'0'+date.date
      this.updateTime = date.year + '-' + newmonth + '-' + day
      console.log(this.updateTime)
    },
   one(){
      if(this.form.leaseStartTime==null){
        this.addDate();
        this.form.leaseStartTime=this.updateTime;
      }
      console.log(this.form.leaseStartTime);
      let moment1 = moment(this.form.leaseStartTime).add(1,"years").format('YYYY-MM-DD');
      this.form.leaseStartTime=moment1;
    },
    two(){
      if(this.form.leaseStartTime==null){
        this.addDate();
        this.form.leaseStartTime=this.updateTime;
      }
      console.log(this.form.leaseStartTime);
      let moment1 = moment(this.form.leaseStartTime).add(2,"years").format('YYYY-MM-DD');
      this.form.leaseEndTime=moment1;
    },
    three(){
      if(this.form.leaseStartTime==null){
        this.addDate();
        this.form.leaseStartTime=this.updateTime;
      }
      console.log(this.form.leaseStartTime);
      let moment1 = moment(this.form.leaseStartTime).add(3,"years").format('YYYY-MM-DD');
      this.form.leaseEndTime=moment1;
    },
    four(){
      if(this.form.leaseStartTime==null){
        this.addDate();
        this.form.leaseStartTime=this.updateTime;
      }
      console.log(this.form.leaseStartTime);
      let moment1 = moment(this.form.leaseStartTime).add(4,"years").format('YYYY-MM-DD');
      this.form.leaseEndTime=moment1;
    },
    five(){
      if(this.form.leaseStartTime==null){
        this.addDate();
        this.form.leaseStartTime=this.updateTime;
      }
      console.log(this.form.leaseStartTime);
      let moment1 = moment(this.form.leaseStartTime).add(5,"years").format('YYYY-MM-DD');
      this.form.leaseEndTime=moment1;
    },
    Edit(index, row) {
      console.log(index, row);
    },
  }
};
</script>
<style>
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409EFF;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>
